import Link from "next/link"
import Image from "next/image"
import { imgList } from "../data"

const Home = () => {
  return (
    <div className="container mx-auto mt-10">
      <div className="grid grid-cols-4 gap-2">
        {imgList.map((item) => (
          <Link key={item.id} href={`/photos/${item.id}`}>
            <Image
              className="cursor-pointer rounded-lg object-cover"
              src={item.path}
              width={1328}
              height={1328}
              priority={true}
              alt="image"
            />
          </Link>
        ))}
      </div>
    </div>
  )
}

export default Home
